<template>
  <Box1 style="display: flex; gap: 20px;" title="风险标签">
    <div style="padding: 0px;">

      <el-scrollbar height="90px">
        <el-tag v-for="item in props.labels" :key="item.label" type="danger" effect="dark" round
          style="float: left;margin: 5px;">
          {{ item }}
        </el-tag>
        <div style="clear: both;"></div>
      </el-scrollbar>
    </div>
  </Box1>
</template>

<script lang="ts" setup>
import { ref } from 'vue'
import Box1 from '@/components/Box1.vue'

import type { TagProps } from 'element-plus'

const props = defineProps(['labels'])

type Item = { type: TagProps['type']; label: string }



// const items = ref<Array<Item>>([
//   { type: 'primary', label: 'Tag 1' },
//   { type: 'success', label: 'Tag 2' },
//   { type: 'info', label: 'Tag 3' },
//   { type: 'warning', label: 'Tag 4' },
//   { type: 'danger', label: 'Tag 5' },
// ])
</script>
